<?xml version="1.0"?>

<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:p="http://primefaces.org/ui"
  xmlns:portlet="http://java.sun.com/portlet_2_0"
  xmlns:fn="http://java.sun.com/jsp/jstl/functions"
  xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:ui="http://java.sun.com/jsf/facelets">

  <portlet:defineObjects />

  <h:form  id="view_bookmarks">

    <div class="bookmarks-add-wrap">
      <h:commandLink styleClass="rp-link-button rp-link-button-alt" action="#{bookmarkBackingBean.addNewBookmark}">
        <f:ajax render=":bookmark_panel" />L&#228;gg till
      </h:commandLink>
    </div>


    <div class="bookmark-items">
      <h:panelGroup rendered="#{not empty bookmarkBackingBean.customBookmarks}">

          <p:dataList value="#{bookmarkBackingBean.customBookmarks}"
            styleClass="bookmarks"
            var="bookmark"
            id="bookmarks"
            paginator="true"
            paginatorAlwaysVisible="false"
            rows="#{bookmarkBackingBean.paginatorRows}"
            pageLinks="#{bookmarkBackingBean.paginatorPageLinks}"
            paginatorTemplate=" #{bookmarkBackingBean.paginatorFirstPageLink} {PageLinks} #{bookmarkBackingBean.paginatorLastPageLink} "
            type="none"
            paginatorPosition="bottom"
            rowIndexVar="rowIndex">

            <div class="bookmark-item bookmark-item-minimized">

              <div class="bookmark-title-wrap">
                <a class="bookmark-title-toggle" href="#">Toggle </a>
                
                <div class="bookmark-controls">

                  <p:commandLink
                    styleClass="bookmark-edit"
                    action="#{bookmarkBackingBean.editBookmark}"
                    title="Redigera"
                    update=":bookmark_panel"
                    ajax="true"
                    async="true">
                      <f:setPropertyActionListener value="#{bookmark.id}" target="#{bookmarkBackingBean.bookmarkId}"/>
                      <span class="icon-edit"></span>
                      <span class="text-label">Redigera</span>
                    </p:commandLink>

                    <p:commandLink
                      title="Ta bort"
                      styleClass="bookmark-delete icon-delete"
                      onclick="delete_dialog.show()"
                      actionListener="#{bookmarkBackingBean.setBookmarkId(bookmark.id)}">
                      <span class="icon-remove"></span>
                      <span class="text-label">Ta bort</span>
                    </p:commandLink>

                  </div>

                <a  class="bookmark-title-content" href="#{bookmark.url}" target="_BLANK">#{bookmark.title}</a>
              </div>

              <div class="bookmark-more-info">
                  <h:panelGroup rendered="#{fn:length(bookmark.title) ge 22}">
                    <p>#{bookmark.title}</p>
                  </h:panelGroup>
                  <p>#{bookmark.url}</p>
                  <p>#{bookmark.description}</p>
                </div>
              </div>
            </p:dataList>

      </h:panelGroup>

      <ui:remove><!-- Shows if the list is empty --></ui:remove>

      <h:panelGroup rendered="#{empty bookmarkBackingBean.customBookmarks}">
          <p>Du har inte lagt till n&#229;gra egna bokm&#228;rken &#228;nnu.</p>
      </h:panelGroup>

    </div>



    </h:form>

</ui:composition>
